<template>
  <div class="login">
   <userVue></userVue>
  <van-form @submit="onSubmit">
    <van-cell-group>
      <van-field
        v-model="username"
        name="username"
        left-icon="contact"
        placeholder="用户名"
        :rules="[{ required: true, message: '请填写用户名' }]"
      />
     <van-field
        v-model="password"
        type="password"
        name="password"
        left-icon="bag-o"
        placeholder="密码"
        :rules="[{ required: true, message: '请填写密码' }]"
      />
    </van-cell-group>
    <div class="go">
      <span @click="changeRegister">{{msg}}</span>
      <span @click="changeForget">{{msg2}}</span>
    </div>
    <div style="margin: 16px;">
      <van-button round block type="info" native-type="submit">提交</van-button>
    </div>
  </van-form>
  </div>
</template>

<script>
import { getLogin } from '@/api/handpick'
import userVue from '@/components/user.vue'
export default {
  name: 'LoginVue',
  data () {
    return {
      username: '',
      password: '',
      msg: '免费注册',
      msg2: '忘记密码'
    }
  },
  components: {
    userVue
  },
  mounted () {

  },
  methods: {
    // http://42.192.236.134:8090/wx/user/index
    onSubmit (values) {
      window.localStorage.setItem('username', this.username)
      // console.log('submit', values)
      getLogin(this.username, this.password).then(res => {
        console.log(res.data.data.token)
        if (res.data.errmsg === '成功') {
          this.$toast.success(res.data.errmsg)
          // token
          window.localStorage.setItem('Authorization', res.data.data.token)
          // 头像
          window.localStorage.setItem('avatar', res.data.data.userInfo.avatarUrl)
        } else {
          this.$toast.fail(res.data.errmsg)
        }
        this.$router.push('/me')
      }).catch(err => {
        console.log(err)
      })
    },
    changeRegister () {
      this.$router.push('/register')
    },
    changeForget () {
      this.$router.push('/login/forget')
    }
  }
}
</script>

<style lang="scss" scoped>
.go{
  padding: 0 .4rem;
}
.go span:nth-child(2){
  float: right;
}
.go span{
  font-size: 0.4rem;
  color: #000;
}
</style>
